<!DOCTYPE html 
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<TITLE>Feed Application</TITLE>
<link rel="stylesheet" href="css/common.css" type="text/css">
<link rel="stylesheet" href="css/profile.css" type="text/css">
<script type="text/javascript" src="jquery-1.3.1.js"></script>
<script src="jquery-ui-personalized-1.5.3.js"></script>
<script>

    $(document).ready(function(){
        $(".feed").draggable();
    });
    

</script>
  

</head>
<body>
<div id="header">
    <h1 id="logo">ApplicationName</h1>
    <div id="profile_wrapper">
        <img id="user_avatar" width="40px" height="50px" src="#" alt="User Avatar"/>
        <h3>Nome Utente</h3>
        <span><a href="#">logout</a> | <a href="#">settings</a></span>
    </div>
</div>



<div id="toolbar">
    <div id="tool_create" class="toolbar_button">
        <a href="#">create</a>
    </div>
    <div id="tool_delete" class="toolbar_button">
        <a href="#">delete</a>
    </div>
    <div id="tool_connect" class="toolbar_button">
        <a href="#">connect</a>
    </div>
    <div id="searchbar">
        <form action="search.pl">search<input type="text"/><input type="submit" style="display: none;"></form>
    </div>
</div>


 <div id="groups">
    <h2 onclick="document.getElementById('group_content').style.display = 'block'">Groups</h2>
    <div id="group_content">
        <form id="filterbar" action="filtra.pl">filtra<input type="text"/><input type="submit" style="display:none;"></form>
        <ul>
            <li>
                <span><a href="#">Literature</a></span>
            </li>
            <li>
                <span><a href="#">Home</a></span>
            </li>
            <li>
                <span><a href="#">IT</a></span>
            </li>
            <li>
                <span><a href="#">Movies</a></span>
            </li>
        </ul>
    </div>
</div>

<div id="wrapper">
    <div id="feed_wrapper">
    <div class="feed" id="db_id_1" style="top: 100px; left: 100px;">
        <h2 onclick="document.getElementById('wrap_db_id_1').style.display = 'block'">Feed Name</h2>
        <span class="feed_date">date 23/1/2008</span>
        <div class="feed_post_wrapper" id="wrap_db_id_1">
            <ol >
                <li>
                    <h4>Titolo del mio post</h4>
                    <span class="feed_post_date">published 23/04/2008</span>
                    <p>Qui ci andranno i primi tot caratteri del post, che finiranno con dei ... <a href="#">read all</a></p>
                </li>
                <li>
                    <h4>Titolo del mio post</h4>
                    <span class="feed_post_date">published 23/04/2008</span>
                    <p>Qui ci andranno i primi tot caratteri del post, che finiranno con dei ... <a href="#">read all</a></p>
                </li>
                <li>
                    <h4>Titolo del mio post</h4>
                    <span class="feed_post_date">published 23/04/2008</span>
                    <p>Qui ci andranno i primi tot caratteri del post, che finiranno con dei ... <a href="#">read all</a></p>
                </li>
                <li>
                    <h4>Titolo del mio post</h4>
                    <span class="feed_post_date">published 23/04/2008</span>
                    <p>Qui ci andranno i primi tot caratteri del post, che finiranno con dei ... <a href="#">read all</a></p>
                </li>
            </ol>
        <ul class="feed_toolbar">
            <li><a href="#">view connections</a></li>
            <li><a href="#">view tags</a></li>
        </ul>
        </div>
    </div>
    <div class="feed" id="db_id_1" style="top: 200px; left: 200px;">
        <h2 onclick="document.getElementById('wrap_db_id_2').style.display = 'block'">Feed Name</h2>
        <span class="feed_date">date 23/1/2008</span>
        <div class="feed_post_wrapper"  id="wrap_db_id_2">
            <ol>
                <li>
                    <h4>Titolo del mio post</h4>
                    <span class="feed_post_date">published 23/04/2008</span>
                    <p>Qui ci andranno i primi tot caratteri del post, che finiranno con dei ... <a href="#">read all</a></p>
                </li>
                <li>
                    <h4>Titolo del mio post</h4>
                    <span class="feed_post_date">published 23/04/2008</span>
                    <p>Qui ci andranno i primi tot caratteri del post, che finiranno con dei ... <a href="#">read all</a></p>
                </li>
                <li>
                    <h4>Titolo del mio post</h4>
                    <span class="feed_post_date">published 23/04/2008</span>
                    <p>Qui ci andranno i primi tot caratteri del post, che finiranno con dei ... <a href="#">read all</a></p>
                </li>
            </ol>
        <ul class="feed_toolbar">
            <li><a href="#">view connections</a></li>
            <li><a href="#">view tags</a></li>
        </ul>
        </div>
    </div>
    <div class="feed" id="db_id_1" style="top: 300px; left: 300px;">
        <h2 onclick="document.getElementById('wrap_db_id_3').style.display = 'block'">Feed Name</h2>
        <span class="feed_date">date 23/1/2008</span>
        <div class="feed_post_wrapper"  id="wrap_db_id_3">
            <ol>
                <li>
                    <h4>Titolo del mio post</h4>
                    <span class="feed_post_date">published 23/04/2008</span>
                    <p>Qui ci andranno i primi tot caratteri del post, che finiranno con dei ... <a href="#">read all</a></p>
                </li>
                <li>
                    <h4>Titolo del mio post</h4>
                    <span class="feed_post_date">published 23/04/2008</span>
                    <p>Qui ci andranno i primi tot caratteri del post, che finiranno con dei ... <a href="#">read all</a></p>
                </li>
            </ol>
        <ul class="feed_toolbar">
            <li><a href="#">view connections</a></li>
            <li><a href="#">view tags</a></li>
        </ul>
        </div>
    </div>
    </div>
</div>



<div id="help">
    <h2 id="help_title"  onclick="document.getElementById('help_content').style.display = 'block'">Help</h2>
        <div id="help_content">
            <p>help not available yet :-(</p>
        </div>
</div>

</body>
</html>